<template>
    <div class="container">
        <div class="title">{{title}}</div>
        <template v-for="(item, index) in list">
            <div class="label" :key="'label' + index">{{item.label}}</div>
            <div class="bold" :style="{'color': item.isGoal ? '#64E6E2': '#FFF'}" :key="'value' + index">{{item.value}}</div>
            <div class="unit" :key="'unit' + index">{{item.unit}}</div>
        </template>
    </div>
</template>
<script>
export default {
    props: {
        data: Object,
        title: String,
        type: String
    },

    computed: {
        list() {
            let array = []
            if (this.type == '1') {
                array.push({label: '专业人才', unit: '人', value: this.data.zyrc})
                array.push({label: '配套人员', unit: '人', value: this.data.ptry})
                array.push({label: '群众演员', unit: '人', value: this.data.qzyy})
            } else if (this.type == '2') {
                array.push({label: '年度目标', unit: '人', value: this.data.zyrc_mb, isGoal: true})
                array.push({label: '年度目标', unit: '人', value: this.data.ptry_mb, isGoal: true})
                array.push({label: '年度目标', unit: '人', value: this.data.qzyy_mb, isGoal: true})
            } else if (this.type == '3') {
                array.push({label: '横 店 出 品', unit: '部', value: this.data.hdcp, isGoal: false})
                array.push({label: '产 业 税 收', unit: '亿元', value: this.data.cyss, isGoal: false})

            } else if (this.type == '4') {
                array.push({label: '十四五目标', unit: '部', value: this.data.hdcp_mb, isGoal: true})
                array.push({label: '十四五目标', unit: '亿元', value: this.data.cyss_mb, isGoal: true})
            }
            return array;
        }
    }
}
</script>
<style lang="less" scoped>
.container {
    display: flex;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;

}
.title {
    font-family: PingFangSC-Medium;
    font-size: 20px;
    color: #FFFFFF;
    letter-spacing: 1.2px;
    font-weight: 500;
}
.label {
    font-family: PingFangSC-Regular;
    font-size: 16px;
    color: #FFFFFF;
    letter-spacing: 0.96px;
    text-align: right;
    font-weight: 400;
    padding: 0 20px;
}
.bold {
    font-family: DINPro-Medium;
    font-size: 16px;
    color: #FFFFFF;
    letter-spacing: 0.96px;
    line-height: 24px;
    font-weight: 500;
}
.unit {
    font-family: PingFangSC-Regular;
    font-size: 16px;
    color: #FFFFFF;
    letter-spacing: 0.96px;
    text-align: right;
    font-weight: 400;
    opacity: 0.72;
    padding-left: 4px;
}
</style>
